<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<script type="text/javascript" src="js/jquery.min.js" ></script>
		<script>
			$(function(){
				$('.left li').click(function(){
					$(this).addClass('active').siblings().removeClass('active');
					var _index=$(this).index();
					var top = -_index*298;
					$('.all').animate({
						top:top
					},500);
				})
			})
		</script>
		<title></title>
	</head>
	<body>
		<div id="box">
			<ul class="left">
				<li class='active'>新闻</li>
				<li>娱乐</li>
				<li>彩票</li>
			</ul>
			<div class="area">
				<ul class="all">
				<li>快学网,快人一步</li>
					<li>快学网,快人一步</li>
					<li>快学网,快人一步</li>
				</ul>
			</div>
		</div>
	</body>
</html>
